<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>
    table {
      margin: 50px auto;
      border-collapse: collapse;
      width: 600px;
      height: 100px;
      text-align: center;

    }

    table,
    th,
    td {
      border: 1px solid black;
    }
  </style>
</head>

<body>
  <!-- <table>
    <tr>
      <th>编号</th>
      <th>科目</th>
      <th>成绩</th>
      <th>操作</th>
    </tr> -->
  <!-- <tr>
      <td>1</td>
      <td>语文</td>
      <td>46</td>
      <td><a href="#">删除</a></td>
    </tr> 
  
    <tr>
   <td colspan="2">1</td>
      <td >语文</td>
      <td colspan="2">46</td>
      <td><a href="#">删除</a></td>
    </tr>-->
  </table>
  <script>
    //1.显示随机名字后删除
    // let uname = ["小李", "老李", "小传", "小黑"]
    // let random = Math.floor(Math.random() * uname.length)
    // console.log(uname[random]);
    // uname.splice(random, 1)
    // console.log(uname);
    // 2.声明对象
    // let per = {
    //   gender: '女',
    //   age: 18,
    //   hobby: 'speak',
    //   say: function () {
    //     document.write('hi~~~')
    //   },
    //   eat: function () {
    //     document.write('meat')
    //   }
    // }
    // console.log(per.age);
    // console.log(per['gender']);
    // console.log(per);
    // per.say()
    // per.eat()
    //3.调用对象的方法
    //4.猜数字游戏，设定次数，最多猜8次
    // let random = Math.floor(Math.random() * 10 + 1)
    // console.log(random);
    // let flag = true
    // for (let i = 1; i <= 3; i++) {

    //   let num = +prompt('请输入1-10之间的任意数字（只有3次机会）')
    //   if (num > random) {
    //     alert('数字猜大了')
    //   } else if (num < random) {
    //     alert('数字猜小了')
    //   } else {
    //     flag = false
    //     alert('恭喜你猜对了')
    //     break
    //   }
    // }
    // if (flag) {
    //   alert('次数用完了')
    // }
    //5.随机生成颜色的案例
    // function getRandomColor(flag = true) {
    //   if (flag) {
    //     let str = '#'
    //     let arr = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'a', 'b', 'c', 'd', 'e', 'f']
    //     for (let i = 1; i <= 6; i++) {
    //       let random = Math.floor(Math.random() * arr.length)
    //       str = str + arr[random]
    //     }
    //     return str
    //   } else {
    //     let r = Math.floor(Math.random() * 255 + 1)
    //     let g = Math.floor(Math.random() * 255 + 1)
    //     let b = Math.floor(Math.random() * 255 + 1)
    //     return `rgb(${[r, g, b]})`
    //   }
    // }
    // console.log(getRandomColor(true)) //#ffffff
    // console.log(getRandomColor(false))
    // console.log(getRandomColor())
    //6.
    //7.扩展作业2
    let data = [
      { subject: '语文', score: 46 },
      { subject: '数学', score: 80 },
      { subject: '英语', score: 100 },
    ]
    let str = ""
    let sum = 0
    for (let i = 0; i < data.length; i++) {
      str += `<tr>
      <td>${i + 1}</td>
      <td>${data[i].subject}</td>
      <td>${data[i].score}</td>
      <td><a href="#">删除</a></td>
    </tr>`
      sum += data[i].score
    }
    document.write(`
        <table>
    <tr>
      <th>编号</th>
      <th>科目</th>
      <th>成绩</th>
      <th>操作</th>
    </tr>
    <tr>
    ${str}
    </tr> 
    <tr>
    <td colspan="2">总分：${sum}</td>
     <td colspan="2">平均分：${parseInt(sum / data.length)}</td>
    </tr>-->
    </table>      
        `)

      // let obj = {
      //   name: '张三',
      //   age: 20,
      //   sex: '男',
      //   address: '中国人'
      // }
      // // 获取姓名
      // console.log(obj['name']);

      // // 获取地址
      // console.log(obj.address);



  </script>
  </table>
</body>

</html>